<style type="text/css">          
td{padding:0;margin:0;}
</style>
<div id="result">
    <div class="reLoad">
        <?php echo $this->Session->flash(); ?>
        <div class="div_header1"><?php if(isset($this->data['Cat']['Category']['category_name'])) echo __("Sizes for ").$this->data['Cat']['Category']['category_name'];?></div>
        <br style="clear:both;">
        <table align="center" border="0" cellpadding="0" width="530">
                <?php
                if($this->data['Size']):
                    foreach($this->data['Size'] as $size):
                ?>
                <tr>
					<td width="25">
						<?php $checked="";
						if($this->data['Cat']['Category']['sizes_dropdown'] && in_array($size['Sizetitle']['id'],$this->data['Cat']['Category']['sizes_dropdown']))
							$checked=' checked="checked"';
						else
							$checked="";
						?>
						<input name="setdropdown[]" type="checkbox" value="<?php echo $size['Sizetitle']['id'];?>" <?php echo $checked;?> />
					</td>
					<td width="40"><a href="javascript:void(0);"  action="deletesizelabel" controller="add_category" ElmID2="<?php echo $this->data['Cat']['Category']['id'];?>" ElmID="<?php echo $size['Sizetitle']['id'];?>" onclick="deleteValue(this)"><?php echo $this->Html->image("close-btn.png", array("alt" => "Delete",'border'=>'0'));?></a>&nbsp;
					<a href="javascript:void(0);" class="editsizetitle" valueID="<?php echo $size['Sizetitle']['id'];?>"><?php echo $this->Html->image("edit.gif", array("alt" => "Edit",'border'=>'0'));?></a></td>
					<td width="450">
						<span id="editsizetitle_<?php echo $size['Sizetitle']['id'];?>"><?php echo $size['Sizetitle']['size_title'];?></span>
						<div id="edittitleform_<?php echo $size['Sizetitle']['id'];?>" style="display:none;">
							<input type="hidden" name="cat_id" id="CatId_<?php echo $size['Sizetitle']['id'];?>" value="<?php echo $this->data['Cat']['Category']['id'];?>">
							<input type="text" name="size_title" id="SizeTitle_<?php echo $size['Sizetitle']['id'];?>" size="15" value="<?php echo $size['Sizetitle']['size_title'];?>">&nbsp;
							<input type="button" value="Cancel" name="Cancel_title" upid="<?php echo $size['Sizetitle']['id'];?>">&nbsp;
							<input type="button" name="Update_title" value="Update" upid="<?php echo $size['Sizetitle']['id'];?>">
						</div>
					</td>
                </tr>
                <tr>
                        <td width="25">&nbsp;</td>
                        <td width="25">&nbsp;</td>
                        <td width="450">
                            <form method="post" id="addSizeValue_<?php echo $size['Sizetitle']['id'];?>"  name="addSizeValue_<?php echo $size['Sizetitle']['id'];?>" action="javascript:void(0);">
                                <table align="left" cellpadding="0" cellspacing="0" border="0" id="SizeValueTable_<?php echo $size['Sizetitle']['id'];?>">
                                    <?php if($size['Sizevalue']){
                                        $total_size_value=count($size['Sizevalue']);
                                        $i=1;
                                        foreach($size['Sizevalue'] as $Sizevalue){
                                    ?>
                                    <tr>
										<td width="10">&nbsp;</td>
										<td width="10" align="center">
										<?php
										if($total_size_value==$i){
											echo $this->Html->image("link-line-02.gif", array("alt" => "Line",'border'=>'0'));
										}else{
											echo $this->Html->image("link-line-01.gif", array("alt" => "Line",'border'=>'0'));
										}
										?>
										</td>
										<td width="10"><?php echo $this->Html->image("arrow-black.gif", array("alt" => "Line",'width'=>'10','height'=>'7','border'=>'0'));?></td>
										<td width="220">
											<span id="editsizevalue_<?php echo $Sizevalue['id'];?>"><?php echo $Sizevalue['size_value'];?></span>
											<div id="editsizeform_<?php echo $Sizevalue['id'];?>" style="display:none;">												
												<input type="hidden" name="sizetitle_id" id="SizeTitleId_<?php echo $Sizevalue['id'];?>" value="<?php echo $size['Sizetitle']['id'];?>">
												<input type="text" name="size_value" id="SizeValue_<?php echo $Sizevalue['id'];?>" size="15" value="<?php echo $Sizevalue['size_value'];?>">&nbsp;
												<input type="button" value="Cancel" name="Cancel" upid="<?php echo $Sizevalue['id'];?>">&nbsp;
												<input type="button" name="Update" value="Update" upid="<?php echo $Sizevalue['id'];?>">												
											</div>
										</td>
										<td width="120">
											<a href="javascript:void(0);" class="editsizevalue" valueID="<?php echo $Sizevalue['id'];?>" sizetitleID="<?php echo $size['Sizetitle']['id'];?>"><?php echo $this->Html->image("edit.gif", array("alt" => "Edit",'border'=>'0'));?></a>
											<a href="javascript:void(0);" action="deletesizevalue" controller="add_category" ElmID2="<?php echo $this->data['Cat']['Category']['id'];?>" ElmID="<?php echo $Sizevalue['id'];?>" valueID="<?php echo $Sizevalue['id'];?>"  onclick="deleteValue(this)" class="deleteValue1"><?php echo $this->Html->image("close-btn.png", array("alt" => "Delete",'border'=>'0'));?></a>
										</td>
                                    </tr>
                                        <?php $i++; } }?>

                                        </table>
                                        <table align="left" cellpadding="0" cellspacing="0" border="0"width="200">
                                                  <tr>
                                                        <td width="10">&nbsp;</td>
                                                        <td colspan="140" valign="top">
                                                        <input type="hidden"  name="data[sizetitle_id]" id="dataSizetitleId" value="<?php echo $size['Sizetitle']['id'];?>" />
                                                        <input type="hidden"  name="data[sizetitle_size_title]" value="<?php echo $size['Sizetitle']['size_title'];?>" />
                                                        <?php echo $this->Form->input('size_value',array('label'=>false,'size'=>30,'maxlength'=>50,'id'=>'size_value','class'=>"required", 'title'=>"Enter ".$size['Sizetitle']['size_title']." size", 'value'=>"Enter ".$size['Sizetitle']['size_title']." size"
                                                ,'onblur'=>"if(this.value=='') this.value='Enter ".$size['Sizetitle']['size_title']." size'",'onfocus'=>"if(this.value=='Enter ".$size['Sizetitle']['size_title']." size') this.value='';")); ?></td>
                                                        <td width="50" valign="top"><input name="Add" class="Addsizevalue" sizeID="<?php echo $size['Sizetitle']['id'];?>" catID="<?php echo $this->data['Cat']['Category']['id'];?>" type="button" value="Add" onclick="addSizeValue(this)"/></td>
                                                </tr>
                                        </table>
                                </form>
                        </td>
                </tr>
                <tr>
                 <td colspan="3" height="10">&nbsp;</td>
                </tr>
                <?php endforeach;  if(count($this->data['Size'])>0):?>

                <tr>
                        <td colspan="3" align="right">
                                <input type="button" id="dropdown" value="Set in one dropdown" />&nbsp;&nbsp;
                                <input type="button" id="removedropdown" value="Remove from dropdown" />
                        </td>
                </tr>
                <?php endif;endif;?>
                <tr>
                        <td colspan="3" valign="top">
                        <form method="post" id="addSize"  name="addSize" action="<?php echo Configure::read('base_url')."add_category/sizes/".$this->data['Cat']['Category']['id'];?>">

                        <table cellpadding="0" cellspacing="0" border="0">
                                <tr>
                                        <td width="25">&nbsp;</td>
                                        <td valign="top">
                                                <input type="hidden"  name="data[category_id]" id="catid" value="<?php echo $this->data['Cat']['Category']['id'];?>" />
                                                <?php echo $this->Form->input('size_title',array('label'=>false,'size'=>30,'maxlength'=>50,'id'=>'size_title','class'=>"required", 'title'=>"Enter size title", 'value'=>"Enter size title"
                                                ,'onblur'=>"if(this.value=='') this.value='Enter size title'",'onfocus'=>"if(this.value=='Enter size title') this.value='';")); ?>

                                        </td>
                                        <td  valign="top"><input type="submit" name="submitButton" value="Add" /></td>
                                </tr>
                        </table>
                        </form>
                        </td>
                </tr>
        </table>
    </div>
</div>
<?php  echo $html->script(array("jquery.min.js","jquery.form.js","jquery.validate.js","jquery.tablednd.js")); ?>
<script type="text/javascript">  

//Size Title 
jQuery(".editsizetitle").live('click',function(){
	var valueID=jQuery(this).attr("valueID");
	jQuery("#editsizetitle_"+valueID).fadeOut("200");
	jQuery("#edittitleform_"+valueID).fadeIn("200");
	
});

jQuery('[name="Cancel_title"]').live('click', function(){
	var valueID=jQuery(this).attr("upid");
	jQuery("#edittitleform_"+valueID).fadeOut("200");
	jQuery("#editsizetitle_"+valueID).fadeIn("200");	
});

jQuery('[name="Update_title"]').live('click', function(){
	valueID=jQuery(this).attr("upid");
	var CatId=jQuery("#CatId_"+valueID).val();
	var SizeTitle=jQuery("#SizeTitle_"+valueID).val();

	//var data=jQuery("form#editsizevalue"+valueID).serialize();
	var data="sizetitle_id="+valueID+"&size_title="+SizeTitle+"&cat_id="+CatId;
	jQuery.ajax({
				type: 'post',
				url: baseurl+"add_category/update_size_title/",
				data: data,
				dataType: 'json',
				success:function(msg){
					if(msg.message=="Duplicate"){
						alert("Duplicate entry. Please use different.");
					}
					else if(msg.message=="Yes")
					{
						jQuery("#editsizetitle_"+valueID).html(msg.value);
						jQuery("#SizeTitle_"+valueID).val(msg.value);
						jQuery("#edittitleform_"+valueID).fadeOut("200");
						jQuery("#editsizetitle_"+valueID).fadeIn("200");						
						alert("Size title has been updated successfully.");
					}else{
						alert("Size title could not updated. Please try again.");
					}
					return false;
				}	
			});
	return false;
});
//Size Title End

//Size Value
jQuery("a.editsizevalue").live('click',function(){
	var valueID=jQuery(this).attr("valueID");
	var sizetitleID=jQuery(this).attr("sizetitleID");
	jQuery("#editsizevalue_"+valueID).fadeOut("200");
	jQuery("#editsizeform_"+valueID).fadeIn("200");
});

jQuery('[name="Cancel"]').live('click', function(){
	var valueID=jQuery(this).attr("upid");
	jQuery("#editsizeform_"+valueID).fadeOut("200");
	jQuery("#editsizevalue_"+valueID).fadeIn("200");
});

jQuery('[name="Update"]').live('click', function(){
	var valueID=jQuery(this).attr("upid");	
	var SizeTitleId=jQuery("#SizeTitleId_"+valueID).val();
	var SizeValue=jQuery("#SizeValue_"+valueID).val();

	//var data=jQuery("form#editsizevalue"+valueID).serialize();
	var data="size_id="+valueID+"&sizetitle_id="+SizeTitleId+"&size_value="+SizeValue;
	
	jQuery.ajax({
		type: 'post',
		url: baseurl+"add_category/update_size_value/",
		data: data,
		dataType: 'json',
		success:function(msg){
			if(msg.message=="Duplicate"){
				alert("Duplicate entry. Please use different.");
			}
			else if(msg.message=="Yes")
			{
				jQuery("#editsizevalue_"+valueID).html(msg.value);
				jQuery("#SizeValue_"+valueID).val(msg.value);
				jQuery("#editsizeform_"+valueID).fadeOut("200");
				jQuery("#editsizevalue_"+valueID).fadeIn("200");
				jQuery("#SizeValue_"+valueID).val(msg.value);
				alert("Size value has been updated successfully.");
			}else{
				alert("Size value could not updated. Please try again.");
			}
			return false;
		}	
	});
	
	return false;
});
//Size Value End
jQuery('[name="submitButton"]').live('click', function(){
    jQuery("#addSize").validate({
		submitHandler: function(form) {
			jQuery(form).ajaxSubmit({
				//target: "#result
				success: function(){
					jQuery("#result").load(baseurl+"add_category/sizes/<?php echo $this->data['Cat']['Category']['id'];?> #result .reLoad");
				}
			});
		}
    });
});
		
jQuery('#dropdown').live('click', function(){
	catID=jQuery('input[name="data[category_id]"]').val();	
	data=jQuery('input[type="checkbox"]').serialize();
	if(data!=""){
		jQuery.ajax({
				type: 'post',
				url: baseurl+"add_category/setdropdown/"+catID,			
				data: data,
				dataType: 'json',
				success:function(data){
					if(data.message=="Yes")
						alert("Items have successfully set in a dropdown.");						
					else	
						alert("Items could not be set in a dropdown. Please, try again.");						
				}	
			});
		return false;	
	}	
	else{
		alert("You have to select the items to set in a dropdown.");
	}
});	

jQuery('input#removedropdown').live('click', function(){
	catID=jQuery('input[name="data[category_id]"]').val();	
	data=jQuery('input[type="checkbox"]').serialize();
	
		jQuery.ajax({
				type: 'get',
				url: baseurl+"add_category/removedropdown/"+catID,			
				data: data,
				dataType: 'json',
				success:function(data){
					if(data.message=="Yes")
						alert("Items have successfully remove from dropdown.");						
					else	
						alert("Items could not be remove from dropdown. Please, try again.");						
				}
			});
		return false;		
});		
      
function deleteValue(param){
		if(confirm("Are you sure you want to delete this?")){		
			var id=jQuery(param).attr("elmid");
			var id2=jQuery(param).attr("elmid2");
			var action=jQuery(param).attr("action");
			jQuery.ajax({
				type:"get",
				url:baseurl+"add_category/"+action+"/"+id+"/"+id2,
				datatype: 'html',
				success: function(){
					jQuery("#result").load(""+baseurl+"add_category/sizes/"+id2+" #result .reLoad");
				}
			});                        
		}
		else return false;	
	}
function addSizeValue(param){
    catID=jQuery(param).attr("catID");
    sizeID=jQuery(param).attr("sizeID");
    size_title_ID=jQuery("form#addSizeValue_"+sizeID+" input[name='data[sizetitle_id]']").val();
    data = jQuery("form#addSizeValue_"+sizeID).serialize();
    jQuery.ajax({
        type: 'POST',
        url: baseurl+"add_category/addsizevalue/"+sizeID,
        data: data,
        dataType: 'json',
        success: function(data){
            if(data.message=="Duplicate"){
                    alert("Duplicate entry. Please use different.");
            }
            else if(data.message=="Yes")
            {
				jQuery("form#addSizeValue_"+sizeID+" input[type='text']").val("");
				jQuery("#SizeValueTable_"+sizeID+" tr:last").find('td').first().next().html('<img src="<?php echo Configure::read('base_url');?>/img/link-line-01.gif" alt="Line" border="0">');
				html='<tr><td width="10">&nbsp;</td><td width="10" align="center"><img src="<?php echo Configure::read('base_url');?>/img/link-line-02.gif" alt="Line" border="0"></td><td width="10"><img src="<?php echo Configure::read('base_url');?>img/arrow-black.gif" alt="Line" width="10" height="7" border="0"></td><td width="220"><span id="editsizevalue_'+data.valueID+'">'+data.value+'</span><div id="editsizeform_'+data.valueID+'" style="display:none;"><input type="hidden" name="sizetitle_id" id="SizeTitleId_'+data.valueID+'" value="'+size_title_ID+'"><input type="text" name="size_value" id="SizeValue_'+data.valueID+'" size="15" value="'+data.value+'">&nbsp;<input type="button" value="Cancel" name="Cancel" upid="'+data.valueID+'">&nbsp;<input type="button" name="Update" value="Update" upid="'+data.valueID+'"></div></td><td width="120"><a href="javascript:void(0);" class="editsizevalue" valueID="'+data.valueID+'" sizetitleID="'+size_title_ID+'"><?php echo $this->Html->image("edit.gif", array("alt" => "Edit",'border'=>'0'));?></a>&nbsp;<a href="javascript:void(0);" action="deletesizevalue" controller="add_category" ElmID2="'+catID+'" ElmID="'+data.valueID+'"   onclick="deleteValue(this)" class="deleteValue1"><img src="<?php echo Configure::read('base_url');?>img/close-btn.png" alt="Delete" border="0"></a></td></tr>';
				jQuery("#SizeValueTable_"+sizeID).append(html);
            }else{
				jQuery("form#addSizeValue_"+sizeID+" input[type='text']").addClass("error");
				html='<label for="size_title" generated="true" class="error">Enter size value here</label>';
				jQuery("form#addSizeValue_"+sizeID+" input[type='text']").after(html);
            }
            return false;

        }
    });
}
 
</script>
<?php //echo $this->element('sql_dump'); ?>